<template>
	<view class="fee">
		<view class="u-padding-20" style="background-color: #0B868E;">
			<u-search v-model="keyword" :show-action="true" action-text="搜索" :animation="true" @search="search" @custom="search"></u-search>
		</view>
		
		<view class="con-body">

			<view style="background-color: #FFFFFF;margin-top: 1px;">
				<u-tabs :list="tabs" bold='true' activeColor="#0B868E" :current="current" @change="changeTabs">
				</u-tabs>
			</view>

			<u-empty :show="showEmpty" text="暂无数据" mode="list">
			</u-empty>
			</u-empty>
			<view class="uni-flex-center" v-for="(item, index) in List">
				<view class="main-service uni-cell-90" style="padding-bottom: 10rpx; width: 96%; margin-left: 2%;">
					<view class="user-list">
						<view class="title u-rela">
							<view class="u-abso pos_left">
								<text>{{item.title}}</text>
							</view>
							<view class="u-abso pos_right" v-if="item.status==0">
								<text style="color:#007AFF;">{{item.status_label}}</text>
							</view>
							<view class="u-abso pos_right" v-if="item.status==1">
								<text style="color:#18B566;">{{item.status_label}}</text>
							</view>
							<view class="u-abso pos_right" v-if="item.status==2">
								<text style="color:#ff0000;">{{item.status_label}}</text>
							</view>
							<view class="u-abso pos_right" v-if="item.status==-1">
								<text style="color:#ff5500;">{{item.status_label}}</text>
							</view>
							<view class="u-abso pos_right" v-if="item.status==3">
								<text style="color:#000000;">{{item.status_label}}</text>
							</view>
						</view>
						<!-- <u-line></u-line> -->
						<view class="u-padding-20">
							<view class="d_view u-margin-bottom-20">
								<text class="l_title">联系人：{{item.name}}</text>
								<!-- <text class="d_content"></text> -->
								<u-icon style="" class="" color="#008b00" name="phone-fill" size="40rpx" @click="makephone(item.phone)"></u-icon>
							</view>
							<view class="d_view u-margin-bottom-20">
								<text class="l_title">服务天数</text>
								<text class="d_content">{{item.during}}</text>
							</view>
							<view class="d_view">
								<text class="l_title">服务日期</text>
								<text class="d_content">{{item.time}}</text>
							</view>
						</view>
						<view class="u-padding-15 u-border-top u-text-right">
							<u-button class="u-margin-right-20" type="primary" shape="circle" size="mini" @click="classDetail(item.id)">查看详情</u-button>
							<u-button v-if="item.status==0" class="u-margin-right-20" type="success" shape="circle" size="mini" @click="toshowsure(item.id)">审核通过</u-button>
							<!-- <u-button v-if="item.status==0" type="warning" shape="circle" size="mini">审核拒接</u-button> -->
							
						</view>
						<view style="clear: both;"></view>
					</view>
				</view>
			</view>

		</view>
		<u-mask :show="show" @click="show = false">
			<view class="warp">
				<view class="rect" @tap.stop>
					<textarea v-model="reasontext" placeholder="请输入原因:例如信息核实" />
					<button class="btn_con1 margin_auto u-margin-top-20" @click="sureSubmit">确认提交</button>
				</view>
			</view>
		</u-mask>
		<!-- 弹框提示 -->
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		getAdjacentSchool,
		examineAdjacentSchool,
		searchAdjacentSchool
	} from "@/service/shareService.js";
	export default {
		data() {
			return {
				current: 0,
				status:99,
				page:2,
				limit:10,
				tabs: [{
						name: '全部'
					},
					{
						name: '待审核'
					},
					{
						name: '待支付'
					},
					{
						name: '进行中'
					},
					{
						name: '已结束'
					},
					{
						name: '已取消'
					}
				],
				List: [],
				showDel: false,
				showEmpty: false,
				keyword:'',
				
				id:0,
				show:false,
				isagreeStatus:1,
				reasontext:'信息核实，准予通行'      //备注放行或不放行的原因
			}
		},
		onShow() {
			getAdjacentSchool({
				status: this.status
			}).then(this.getAdjacentSchool);
		},
		onReachBottom() {
			getAdjacentSchool({
				status: this.status,
				limit:this.limit,
				page:this.page
			}).then(res=>{
				// console.log(res);
				if(res.code==200){
					if(res.result.length==0){
						this.$refs.uToast.show({
						
							type: 'error',
							title: '没有更多啦',
							icon:false
							// message: e.msg,
						})
					}else{
						let list = res.result;
						list.forEach((item) => {
							this.List.push(item);
						})
						this.page++;
					}
					
				}else {
					this.$refs.uToast.show({
						type: 'error',
						title: '没有更多啦',
						icon:false
						// message: res.msg,
					})
				}
			});
		},
		methods: {
			getAdjacentSchool:function(e){
				
				if (e.code == 200) {
					this.List = e.result;
					if(e.result.length==0){
						this.showEmpty = true;
					}else{
						this.showEmpty = false;
					}
				} else {
					this.showEmpty = true;
					this.List = [];
				}
			},
			search:function(){
				// console.log(this.keyword)
				searchAdjacentSchool({
					keyword:this.keyword
				}).then(res=>{
					if(res.code==200){
						this.List=res.result
					}else{
						this.showEmpty = true;
						this.List=[]
					}
				})
			},
			makephone:function(phone){
				uni.makePhoneCall({
					phoneNumber:phone,
					success(e) {
						console.log(e);
					}
				})
			},
			classDetail:function(id){
				uni.navigateTo({
					url:'./fourHalfDetail?id='+id
				})
			},
			
			changeTabs(e) {
				let par;
				this.current = e;
				switch (this.current) {
					case 1:
						par = {
							status: 0
						};
						this.status=0
						break;
					case 2:
						par = {
							status: 2
						};
						this.status=2
						break;
					case 3:
						par = {
							status: 1
						};
						this.status=1
						break;
					case 4:
						par = {
							status: 3
						};
						this.status=3
						break;
					case 5:
						par = {
							status: -1
						};
						this.status=-1
						break;
					default:
						par = {
							status: 99
						};
						this.status=99
				}
				getAdjacentSchool(par).then(this.getAdjacentSchool);
			},
			
			toshowsure:function(id){
				this.id=id;
				this.show=true
			},
			sureSubmit:function(id){
				
				let status=this.isagreeStatus;
				let memo=this.reasontext;
				examineAdjacentSchool({
					id: this.id,
					status:status,
					memo:memo
				}).then(res=>{
					// console.log(res);
					if(res.code==200){
						this.$refs.uToast.show({
							title: '提交成功！',
							type: 'default', 
							icon: false
						})
						this.show=false;
						getAdjacentSchool().then(this.getAdjacentSchool);
					}else{
						this.$refs.uToast.show({
							title: '提交失败，请稍后重试',
							type: 'default', 
							icon: false
						})
						this.show=false
					}
					
				})
			}
		}
	}
</script>

<style>
	.u-empty.data-v-3d842a77 {
		margin-top:120rpx !important;
	}
	.l_title {
		color: #999;
		float: left;
	}

	.d_content {
		color: #666;
	}

	.d_view {
		font-size: 28rpx;
		color: #999;
		/* margin-top: 30rpx; */
		text-align: right;
	}
	.main-service {
		margin-top: 20upx;
		border-radius: 10upx;
		background: #ffffff;
		box-shadow: 5rpx 5rpx 20rpx rgba(0, 0, 0, 0.15);
	}
	
	.main-service .title {
		height:70rpx;
		line-height: 70rpx;
		font-size: 30rpx;
	}
	.warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
	}
	
	.rect {
		width: 220px;
		height: 180px;
		padding:20rpx;
		border-radius: 10rpx;
		background-color: #fff;
	}
	.rect textarea{
		width:94%;
		height:70%;
		padding:10rpx;
		font-size: 26rpx;
		border:1rpx solid #ddd;
		z-index:0;
	}
	.btn_con1{
		line-height: 60rpx;
		width:90%;
		height:60rpx;
		color:#fff;
		font-size: 28rpx;
		border-radius: 30rpx;
		background-image: url('https://resourse.cnlhjt.com/upload/20220825/d1aa35c1d129137d9b12c8f34e59c5bc.png');
		background-size: 100% 60rpx;
		 /* background-color: #006971; */
	}
</style>
